import React from 'react';
import { observer } from 'mobx-react';
import { WeaUpload ,WeaLocaleProvider} from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;

interface Props {
  editable?: boolean;
  value?: string;
  valueSpan?: string;
  onChange: any;
  column?;
  row?;
  replaceDatas?;
}

@observer
export default class Upload extends React.Component<Props, any> {
  constructor(props) {
    super(props);
    this.state = {replaceDatas: undefined};
  }
  render() {
    const {column, row} = this.props;
    let hide = column && column.isHide && column.isHide(row);
    let names: any;
    if (!this.props.editable) {//没有勾选批量修改，显示其文件名称
        names = row.$(column.key + 'span').values();
    }   

        let main ;
        let sub ;
        let sec;
        let categoryStr;
        let uploadUrl ;
        let maxUploadSize ;
        let mes ;
        const baseProps: any = {};
        /**
                categoryType  0:固定目录   1：选择目录    9：默认设置
                fileFormat   文档限制格式
        */
       if(!column.uploadConditionParam.categoryType||column.uploadConditionParam.categoryType==""){
        mes =  getLabel(388817,"附件上传目录未设置!");   
      }else if(column.uploadConditionParam.categoryType=='1'){//选择目录
              mes=getLabel(500335,"附件上传目录为选择目录，不支持批量操作")+"!";
            }else{              
                main = column.uploadConditionParam.mainCategory;
                sub = column.uploadConditionParam.subCategory;
                sec = column.uploadConditionParam.secCategory;
                if((column.uploadConditionParam.categoryType=='9'&&main<=0&&sub<=0&&sec<=0)||(column.uploadConditionParam.categoryType=='0'&&main<=0&&sub<=0&&sec<=0)){//没有设置目录
                    mes =  getLabel(388817,"附件上传目录未设置!");
                }else{             
                    categoryStr= main + "," + sub + "," + sec;
                    uploadUrl = "/api/formmode/card/docUpload?detailtype=" + column.fieldtype + "&category=" + categoryStr + "&mainId=" + main + "&subId=" + sub + "&secId=" + sec;
                    maxUploadSize = column.uploadConditionParam.maxUploadSize;
                    let filedatas=[];
                    if (this.props.editable) {
                      filedatas=row.$(column.key + 'span').values()?JSON.parse(row.$(column.key + 'span').values()):[]; 
                    }                            
                    baseProps.showBatchLoad = false;
                    baseProps.showClearAll = false;
                    baseProps.uploadUrl = uploadUrl;
                    baseProps.maxUploadSize = maxUploadSize;
                    baseProps.category = {categoryType:column.uploadConditionParam.categoryType,mainCategory:main,maxUploadSize:maxUploadSize,secCategory:sec,subCategory:sub};
                    baseProps.datas = filedatas;
                    baseProps.btnSize = "small";
                    baseProps.autoUpload = "true";
                    baseProps.listType = column.fieldtype == '2' ? "img" : "list";
                    baseProps.limitType =  column.fieldtype == "2" ? "jpg,jpeg,png,gif,bmp" : column.uploadConditionParam.fileFormat === "0" ? "" : column.uploadConditionParam.fileFormat;
                    baseProps.uploadId = column.key;                  
                    baseProps.display = true;
                }  
            }
            baseProps.errorMsg = mes;   
    return (
          <div style={hide ? {display: 'none'} : {display: 'block'}}>
        {this.props.editable ?
          <WeaUpload  
          {...baseProps}
          onChange={(idsT,names,datas)=>{this.props.onChange(idsT.join(','),names,datas);column.onChange&&column.onChange(idsT.join(','),row,names,datas)}}
                      /> : <span dangerouslySetInnerHTML={{__html: names}}></span>}
      </div>
    )
  }
}
